<!--
 * @Author: zhangfan
 * @Date: 2024-06-25 18:36:08
 * @LastEditors: ***
 * @LastEditTime: 2024-06-26 14:12:17
 * @Description: 11
 * @FilePath: /demo/src/views/attrs/index.vue
-->
<template>
  <div class="app">
    <h3>我是父组件</h3>
    <child-one :data1="data1" :data2="data2" :data3="data3" @fun1="fun1" @fun2="fun2"></child-one>
  </div>
</template>
<script>
import childOne from './components/child-one.vue'
export default {
  name: 'App',
  components: {
    childOne
  },
  data () {
    return {
      data1: '11',
      data2: '22',
      data3: '33'
    }
  },
  methods: {
    fun1 (val) {
      console.log('通过子组件触发', val)
    },
    fun2 (val) {
      console.log('通过子组件触发', val)
    }
  }
}
</script>
<style scoped>
.parent {
  border: 1px solid #ccc;
  padding: 50px;
}
.view-contain-box {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-top: 20px;
}
.operate {
  cursor: pointer;
}
</style>
